Enhanced winscp button and new file/folder menu

This commit is contained in:
Marcel Baumgartner
2023-06-25 17:31:36 +02:00
parent 35633e21a9
commit cf91d44902
2 changed files with 146 additions and 52 deletions

View File

@@ -0,0 +1,78 @@
@using Moonlight.App.Helpers.Files
@using Moonlight.App.Services.Interop
@inject ModalService ModalService
<div class="modal fade" id="connectionDetails" tabindex="-1" aria-labelledby="connectionDetails" style="display: none;" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">
<TL>Connection details</TL>
</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row fv-row mb-7">
<div class="col-md-3 text-md-start">
<label class="fs-6 fw-semibold form-label mt-3">
<TL>Host</TL>
</label>
</div>
<div class="col-md-9">
<input type="text" class="form-control form-control-solid disabled" disabled="disabled" value="@(Host)">
</div>
</div>
<div class="row fv-row mb-7">
<div class="col-md-3 text-md-start">
<label class="fs-6 fw-semibold form-label mt-3">
<TL>Port</TL>
</label>
</div>
<div class="col-md-9">
<input type="text" class="form-control form-control-solid disabled" disabled="disabled" value="@(Port)">
</div>
</div>
<div class="row fv-row mb-7">
<div class="col-md-3 text-md-start">
<label class="fs-6 fw-semibold form-label mt-3">
<TL>Username</TL>
</label>
</div>
<div class="col-md-9">
<input type="text" class="form-control form-control-solid disabled" disabled="disabled" value="@(Username)">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
<TL>Close</TL>
</button>
</div>
</div>
</div>
</div>
@code
{
[Parameter]
public FileAccess Access { get; set; }
private string Host = "";
private string Username = "";
private int Port;
protected override async Task OnParametersSetAsync()
{
Uri uri = new Uri(await Access.GetLaunchUrl());
Host = uri.Host;
Port = uri.Port;
Username = uri.UserInfo.Split(':')[0];
}
public async Task Show()
{
await ModalService.Show("connectionDetails");
}
}

View File

@@ -26,7 +26,7 @@ else
<div class="card-header border-0 my-2"> <div class="card-header border-0 my-2">
<div class="card-title"> <div class="card-title">
<div class="d-flex flex-stack"> <div class="d-flex flex-stack">
<FilePath Access="Access" OnPathChanged="OnComponentStateChanged" /> <FilePath Access="Access" OnPathChanged="OnComponentStateChanged"/>
</div> </div>
</div> </div>
<div class="card-toolbar"> <div class="card-toolbar">
@@ -34,21 +34,23 @@ else
@if (View != null && View.SelectedFiles.Any()) @if (View != null && View.SelectedFiles.Any())
{ {
<div class="fw-bold me-5"> <div class="fw-bold me-5">
<span class="me-2">@(View.SelectedFiles.Length) <TL>selected</TL></span> <span class="me-2">
@(View.SelectedFiles.Length) <TL>selected</TL>
</span>
</div> </div>
<WButton Text="@(SmartTranslateService.Translate("Move"))" <WButton Text="@(SmartTranslateService.Translate("Move"))"
WorkingText="@(SmartTranslateService.Translate("Moving"))" WorkingText="@(SmartTranslateService.Translate("Moving"))"
CssClasses="btn-primary me-3" CssClasses="btn-primary me-3"
OnClick="StartMoveFiles"> OnClick="StartMoveFiles">
</WButton> </WButton>
<WButton Text="@(SmartTranslateService.Translate("Compress"))" <WButton Text="@(SmartTranslateService.Translate("Compress"))"
WorkingText="@(SmartTranslateService.Translate("Compressing"))" WorkingText="@(SmartTranslateService.Translate("Compressing"))"
CssClasses="btn-primary me-3" CssClasses="btn-primary me-3"
OnClick="CompressMultiple"> OnClick="CompressMultiple">
</WButton> </WButton>
<WButton Text="@(SmartTranslateService.Translate("Delete"))" <WButton Text="@(SmartTranslateService.Translate("Delete"))"
WorkingText="@(SmartTranslateService.Translate("Deleting"))" WorkingText="@(SmartTranslateService.Translate("Deleting"))"
CssClasses="btn-danger" CssClasses="btn-danger"
@@ -57,37 +59,46 @@ else
} }
else else
{ {
<button type="button" @onclick="Launch" class="btn btn-light-primary me-3"> <div class="btn-group me-3">
<span class="svg-icon svg-icon-muted svg-icon-2"> <button type="button" @onclick="Launch" class="btn btn-light-primary">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <TL>Launch WinSCP</TL>
<path opacity="0.3" d="M5 16C3.3 16 2 14.7 2 13C2 11.3 3.3 10 5 10H5.1C5 9.7 5 9.3 5 9C5 6.2 7.2 4 10 4C11.9 4 13.5 5 14.3 6.5C14.8 6.2 15.4 6 16 6C17.7 6 19 7.3 19 9C19 9.4 18.9 9.7 18.8 10C18.9 10 18.9 10 19 10C20.7 10 22 11.3 22 13C22 14.7 20.7 16 19 16H5ZM8 13.6H16L12.7 10.3C12.3 9.89999 11.7 9.89999 11.3 10.3L8 13.6Z" fill="currentColor"/> </button>
<path d="M11 13.6V19C11 19.6 11.4 20 12 20C12.6 20 13 19.6 13 19V13.6H11Z" fill="currentColor"/> <button type="button" class="btn btn-light-primary dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
</svg> <span class="visually-hidden"></span>
</span> </button>
<TL>Launch WinSCP</TL> <ul class="dropdown-menu">
</button> <li>
<a class="dropdown-item btn" target="_blank" href="https://winscp.net/eng/downloads.php">
<TL>Download WinSCP</TL>
</a>
</li>
<li>
<button class="dropdown-item btn" @onclick="() => ConnectionDetailsModal.Show()">
<TL>Show connection details</TL>
</button>
</li>
</ul>
</div>
<button type="button" @onclick="CreateFile" class="btn btn-light-primary me-3"> <div class="btn-group me-3">
<span class="svg-icon svg-icon-2"> <button type="button" class="btn btn-light-primary dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <TL>New</TL>&nbsp;
<path fill="currentColor" d="M6 22h12a2 2 0 0 0 2-2V8l-6-6H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2zm7-18 5 5h-5V4zM8 14h3v-3h2v3h3v2h-3v3h-2v-3H8v-2z"></path> </button>
</svg> <ul class="dropdown-menu">
</span> <li>
<TL>New file</TL> <button @onclick="CreateFile" class="dropdown-item btn">
</button> <TL>New file</TL>
</button>
</li>
<li>
<button @onclick="CreateFolder" class="dropdown-item btn">
<TL>New folder</TL>
</button>
</li>
</ul>
</div>
<button type="button" @onclick="CreateFolder" class="btn btn-light-primary me-3"> <FileUpload Access="Access" OnUploadComplete="OnComponentStateChanged"/>
<span class="svg-icon svg-icon-2">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path opacity="0.3" d="M10 4H21C21.6 4 22 4.4 22 5V7H10V4Z" fill="currentColor"></path>
<path d="M10.4 3.60001L12 6H21C21.6 6 22 6.4 22 7V19C22 19.6 21.6 20 21 20H3C2.4 20 2 19.6 2 19V4C2 3.4 2.4 3 3 3H9.2C9.7 3 10.2 3.20001 10.4 3.60001ZM16 12H13V9C13 8.4 12.6 8 12 8C11.4 8 11 8.4 11 9V12H8C7.4 12 7 12.4 7 13C7 13.6 7.4 14 8 14H11V17C11 17.6 11.4 18 12 18C12.6 18 13 17.6 13 17V14H16C16.6 14 17 13.6 17 13C17 12.4 16.6 12 16 12Z" fill="currentColor"></path>
<path opacity="0.3" d="M11 14H8C7.4 14 7 13.6 7 13C7 12.4 7.4 12 8 12H11V14ZM16 12H13V14H16C16.6 14 17 13.6 17 13C17 12.4 16.6 12 16 12Z" fill="currentColor"></path>
</svg>
</span>
<TL>New folder</TL>
</button>
<FileUpload Access="Access" OnUploadComplete="OnComponentStateChanged" />
} }
</div> </div>
</div> </div>
@@ -103,13 +114,15 @@ else
DisableScrolling="true"> DisableScrolling="true">
</FileView> </FileView>
</div> </div>
<FileSelectModal @ref="FileSelectModal" <FileSelectModal @ref="FileSelectModal"
OnlyFolder="true" OnlyFolder="true"
Title="@(SmartTranslateService.Translate("Select folder to move the file(s) to"))" Title="@(SmartTranslateService.Translate("Select folder to move the file(s) to"))"
Access="MoveAccess" Access="MoveAccess"
OnSubmit="OnFileMoveSubmit"> OnSubmit="OnFileMoveSubmit">
</FileSelectModal> </FileSelectModal>
<ConnectionDetailsModal @ref="ConnectionDetailsModal" Access="Access"/>
} }
@code @code
@@ -131,16 +144,19 @@ else
private FileAccess MoveAccess; private FileAccess MoveAccess;
private FileSelectModal FileSelectModal; private FileSelectModal FileSelectModal;
private FileData? SingleMoveFile = null; private FileData? SingleMoveFile = null;
// Config // Config
private ContextAction[] Actions = Array.Empty<ContextAction>(); private ContextAction[] Actions = Array.Empty<ContextAction>();
// Connection details
private ConnectionDetailsModal ConnectionDetailsModal;
protected override void OnInitialized() protected override void OnInitialized()
{ {
MoveAccess = (FileAccess)Access.Clone(); MoveAccess = (FileAccess)Access.Clone();
List<ContextAction> actions = new(); List<ContextAction> actions = new();
actions.Add(new() actions.Add(new()
{ {
Id = "rename", Id = "rename",
@@ -151,18 +167,18 @@ else
SmartTranslateService.Translate("Rename"), SmartTranslateService.Translate("Rename"),
SmartTranslateService.Translate("Enter a new name"), SmartTranslateService.Translate("Enter a new name"),
x.Name x.Name
); );
if (name != x.Name) if (name != x.Name)
{ {
await Access.Move(x, Access.CurrentPath + name); await Access.Move(x, Access.CurrentPath + name);
} }
await View!.Refresh(); await View!.Refresh();
} }
}); });
actions.Add(new () actions.Add(new()
{ {
Id = "download", Id = "download",
Name = "Download", Name = "Download",
@@ -188,7 +204,7 @@ else
await ToastService.Error(SmartTranslateService.Translate("You are not able to download folders using the moonlight file manager")); await ToastService.Error(SmartTranslateService.Translate("You are not able to download folders using the moonlight file manager"));
} }
}); });
actions.Add(new() actions.Add(new()
{ {
Id = "compress", Id = "compress",
@@ -199,8 +215,8 @@ else
await View!.Refresh(); await View!.Refresh();
} }
}); });
actions.Add(new () actions.Add(new()
{ {
Id = "decompress", Id = "decompress",
Name = "Decompress", Name = "Decompress",
@@ -221,7 +237,7 @@ else
await StartMoveFiles(); await StartMoveFiles();
} }
}); });
actions.Add(new() actions.Add(new()
{ {
Id = "delete", Id = "delete",
@@ -232,7 +248,7 @@ else
await View!.Refresh(); await View!.Refresh();
} }
}); });
Actions = actions.ToArray(); Actions = actions.ToArray();
} }
@@ -249,11 +265,11 @@ else
await InvokeAsync(StateHasChanged); await InvokeAsync(StateHasChanged);
return true; return true;
} }
await InvokeAsync(StateHasChanged); await InvokeAsync(StateHasChanged);
return false; return false;
} }
private async void Save() private async void Save()
{ {
var data = await Editor.GetData(); var data = await Editor.GetData();
@@ -305,7 +321,7 @@ else
if (string.IsNullOrEmpty(name)) if (string.IsNullOrEmpty(name))
return; return;
await Access.Write(new FileData{IsFile = true, Name = name}, ""); await Access.Write(new FileData { IsFile = true, Name = name }, "");
await View!.Refresh(); await View!.Refresh();
} }
@@ -332,7 +348,7 @@ else
private async Task CompressMultiple() private async Task CompressMultiple()
{ {
await Access.Compress(View!.SelectedFiles); await Access.Compress(View!.SelectedFiles);
await View!.Refresh(); await View!.Refresh();
} }
@@ -342,7 +358,7 @@ else
{ {
await Access.Move(sFile, path + sFile.Name); await Access.Move(sFile, path + sFile.Name);
} }
if (SingleMoveFile != null) if (SingleMoveFile != null)
{ {
await Access.Move(SingleMoveFile, path + SingleMoveFile.Name); await Access.Move(SingleMoveFile, path + SingleMoveFile.Name);