Moving on

This commit is contained in:
Eugene ;) 2020-04-20 00:52:36 +02:00
parent f2cc603195
commit b73c401ff4
14 changed files with 71 additions and 217 deletions

View File

@ -1,12 +0,0 @@
@inherits FileItemBase
<a class="level">
<div class="level-left">
<div class="level-item">
<p class="is-size-7"><sub>@File.Folder</sub></p>
<p class="@(File.CanBeDeleted ? "has-text-danger" : null)">
@File.Name
</p>
</div>
</div>
</a>

View File

@ -1,16 +0,0 @@
using Microsoft.AspNetCore.Components;
using Seenginx.Models;
using System;
using System.Collections.Generic;
using System.Text;
namespace Seenginx.Components
{
public class FileItemBase : ComponentBase
{
[Parameter]
public ConfigFile File { get; set; }
}
}

View File

@ -1,69 +0,0 @@
@typeparam CFile
<div class="filesWithEditor">
<div class="tile is-parent is-4 is-vertical">
<div class="tile is-child">
<div class="buttons are-small">
<button class="button is-static is-outlined"><span class="icon is-small"><i class="mdi mdi-filter-outline"></i></span></button>
@foreach (var filter in Filters)
{
<button @onclick="e => OnFilterClick(e,filter)" class="button is-outlined">@filter</button>
}
</div>
</div>
<div class="tile is-child">
<div class="field">
<p class="control has-icons-left">
<input formnovalidate value="@SearchInput" @onchange="e => SearchInputChanged(e)" class="input is-small is-primary" type="text" placeholder="Search...">
<span class="icon is-small is-left">
<i class="mdi mdi-search-web"></i>
</span>
</p>
</div>
</div>
<div class="tile is-child is-vertical">
<aside class="menu">
<ul class="menu-list">
@foreach (var file in Files)
{
<li @onclick="e => OnFileClick(e,file)" @key="file" class="@file.IsVisible">
<FileItem File="file" @key="file"></FileItem>
</li>
}
</ul>
</aside>
</div>
<div class="tile is-child">
<div class="buttons are-small is-centered has-addons">
<button class="button is-primary" @onclick="OnAddDialog">
<span class="icon is-small">
<i class="mdi mdi-plus-box-outline"></i>
</span>
<span>Add</span>
</button>
<button class="button is-warning" @onclick="OnUpdateDialog">
<span class="icon is-small">
<i class="mdi mdi-pencil-box-outline"></i>
</span>
<span>Update</span>
</button>
<button class="button is-danger" @onclick="OnDeleteDialog">
<span class="icon is-small">
<i class="mdi mdi-minus-box-outline"></i>
</span>
<span>Delete</span>
</button>
</div>
</div>
</div>
<div class="tile is-parent is-vertical is-8">
@Editor
</div>
</div>

View File

@ -1,101 +0,0 @@
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;
using Seenginx.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace Seenginx.Components
{
public partial class FilesWithEditor<CFile> : ComponentBase
where CFile : ConfigFile
{
[Parameter]
public List<CFile> Files { get; set; } = new List<CFile>();
[Parameter]
public List<string> Filters { get; set; } = new List<string>();
[Parameter]
public List<int> FilteredOutFiles { get; set; } = new List<int>();
[Parameter]
public EventCallback<string> ApplyFilter { get; set; }
[Parameter]
public EventCallback AddFile { get; set; }
[Parameter]
public EventCallback<CFile> UpdateFile { get; set; }
[Parameter]
public EventCallback<CFile> DeleteFile { get; set; }
[Parameter]
public RenderFragment<CFile> Editor { get; set; }
[Parameter]
public RenderFragment<CFile> CreateDialog { get; set; }
[Parameter]
public RenderFragment<CFile> UpdateDialog { get; set; }
[Parameter]
public RenderFragment<CFile> DeleteDialog { get; set; }
protected bool IsAnyFileSelected => SelectedFile != default;
[Parameter]
public EventCallback<CFile> SelectedFileChanged { get; set; }
[Parameter]
public CFile SelectedFile { get; set; }
protected string SearchInput { get; set; } = string.Empty;
protected async Task OnDeselectClick()
{
SelectedFile = null;
await SelectedFileChanged.InvokeAsync(SelectedFile);
}
protected async Task OnFilterClick(MouseEventArgs e, string filter)
{
await ApplyFilter.InvokeAsync(filter);
//for (int index = 0; index < Files.Count; index++)
// if (FilteredOutFiles.Contains(index))
// Files[index].Hide();
// else
// Files[index].Unhide();
}
protected async Task SearchInputChanged(ChangeEventArgs e)
{
if (string.IsNullOrEmpty(SearchInput))
Files.ForEach(f => f.Unhide());
else
Files.ForEach(f =>
{
if (f.Name.ToLower().Contains(SearchInput.ToLower()))
f.Unhide();
else
f.Hide();
});
}
protected async Task OnFileClick(MouseEventArgs e, CFile file)
{
await SelectedFileChanged.InvokeAsync(file);
}
protected async Task OnAddDialog()
{
await AddFile.InvokeAsync(null);
}
protected async Task OnUpdateDialog()
{
await UpdateFile.InvokeAsync(SelectedFile);
}
protected async Task OnDeleteDialog()
{
await UpdateFile.InvokeAsync(SelectedFile);
}
}
}

View File

@ -17,8 +17,11 @@ namespace Seenginx.Models
public string Permissions { get; set; }
public bool CanBeDeleted { get; set; } = true;
public string IsVisible { get; set; } = string.Empty;
public string IsSelected { get; set; } = string.Empty;
public void Hide() { IsVisible = "is-hidden"; }
public void Unhide() { IsVisible = string.Empty; }
public void Select() { IsSelected = "is-active"; }
public void Deselect() { IsSelected = string.Empty; }
}
}

View File

@ -1,5 +1,6 @@
@inherits FileItemBase
<a>
<a class="@File.IsSelected" @onclick="SelectFile">
<p class="subtitle is-6"><sub>@File.Folder</sub></p>
<h6 class="title is-6 @(File.CanBeDeleted ? null : "has-text-danger")">@File.Name</h6>
</a>
</a>

View File

@ -1,8 +1,7 @@
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;
using Seenginx.Models;
using System;
using System.Collections.Generic;
using System.Text;
using System.Threading.Tasks;
namespace Seenginx.Components
{
@ -10,6 +9,13 @@ namespace Seenginx.Components
{
[Parameter]
public ConfigFile File { get; set; }
[Parameter]
public EventCallback<ConfigFile> SelectedFileChanged { get; set; }
public async Task SelectFile(MouseEventArgs e)
{
await SelectedFileChanged.InvokeAsync(File);
}
}

View File

@ -26,7 +26,7 @@
</div>
</div>
<div class="filesList neomorphSmall borderRSmall sameMarginBottom">
<div class="filesList neomorphInsetSmall borderRSmall sameMarginBottom">
<aside class="menu">
<ul class="menu-list">
@foreach (var file in Files)
@ -62,8 +62,40 @@
</div>
<div class="tile is-parent is-vertical is-8">
@Editor
<div class="tile is-parent is-vertical">
@if (IsAnyFileSelected)
{
<nav class="level">
<div class="level-left">
<div class="level-item">
<p class="subtitle is-5">
@SelectedFile.Name
</p>
</div>
</div>
<div class="level-right">
<div class="level-item">
<div class="buttons has-addons-right">
<button class="button is-rounded is-light is-small has-icon-left"><span class="icon is-small is-left"><i class="mdi mdi-content-save-alert-outline"></i></span> <span>Save draft</span></button>
<button class="button is-rounded is-dark is-small has-icon-left"><span class="icon is-small is-left"><i class="mdi mdi-undo-variant"></i></span> <span>Undo changes</span></button>
<button class="button is-rounded is-success is-small has-icon-left"><span class="icon is-small is-left"><i class="mdi mdi-content-save-all-outline"></i></span> <span>Save</span></button>
<button class="button is-rounded is-warning is-small has-icon-left"><span class="icon is-small is-left"><i class="mdi mdi-alert-outline"></i></span> <span>Test</span></button>
</div>
</div>
</div>
</nav>
<div class="content">
<textarea class="textarea" placeholder="Uhu" rows="20" @bind="SelectedFile.OriginalBody"></textarea>
</div>
}
else
{
<p class="title">Select any file to start editing...</p>
}
</div>

View File

@ -28,7 +28,7 @@ namespace Seenginx.Components
public EventCallback<CFile> DeleteFile { get; set; }
[Parameter]
public RenderFragment<CFile> Editor { get; set; }
public RenderFragment<CFile> Editor { get; set; } = null;
[Parameter]
public RenderFragment<CFile> CreateDialog { get; set; }
@ -47,7 +47,7 @@ namespace Seenginx.Components
[Parameter]
public EventCallback<CFile> SelectedFileChanged { get; set; }
[Parameter]
public CFile SelectedFile { get; set; }
public CFile SelectedFile { get; set; } = default;
protected async override Task OnInitializedAsync()
{

View File

@ -4,7 +4,7 @@
<FilesWithEditor CFile="ConfigFile" Filters="Filters" Files="ConfigFiles" FilterFolder="FilterFolder"
SelectedFile="SelectedFile" SelectedFileChanged="SelectedFileChanged"
AddFile="AddFile" UpdateFile="UpdateFile" DeleteFile="DeleteFile" >
AddFile="AddFile" UpdateFile="UpdateFile" DeleteFile="DeleteFile">
<CreateDialog>
</CreateDialog>
@ -14,8 +14,5 @@
<DeleteDialog>
</DeleteDialog>
<Editor>
<p>Qualcosa</p>
</Editor>
</FilesWithEditor>

View File

@ -40,6 +40,14 @@
&Bottom {
filter: drop-shadow(8px 8px 14px rgba($dark-shadow, 1));
}
&Inset {
box-shadow: inset 8px 8px 16px rgba($dark-shadow, .5), inset -8px -8px 16px rgba($light-shadow, .5);
&Small {
box-shadow: inset 6px 6px 12px rgba($dark-shadow, .5), inset -6px -6px 12px rgba($light-shadow, .5);
}
}
}
.gradientBackground {
@ -62,6 +70,6 @@
background: $background
}
.sameMarginBottom{
.sameMarginBottom {
margin-bottom: 1rem !important
}

View File

@ -49,6 +49,10 @@
box-shadow: -6px -6px 12px rgba(251, 238, 208, 0.5), 6px 6px 12px rgba(241, 185, 65, 0.5); }
.neomorphBottom {
filter: drop-shadow(8px 8px 14px #f1b941); }
.neomorphInset {
box-shadow: inset 8px 8px 16px rgba(241, 185, 65, 0.5), inset -8px -8px 16px rgba(251, 238, 208, 0.5); }
.neomorphInsetSmall {
box-shadow: inset 6px 6px 12px rgba(241, 185, 65, 0.5), inset -6px -6px 12px rgba(251, 238, 208, 0.5); }
.gradientBackground {
background: linear-gradient(to right bottom, #f7d794, #f5cd79); }

View File

@ -1 +1 @@
#blazor-error-ui{background:#ffffe0;bottom:0;box-shadow:0 -1px 2px rgba(0,0,0,.2);display:none;left:0;padding:.6rem 1.25rem .7rem 1.25rem;position:fixed;width:100%;z-index:1000;}#blazor-error-ui .dismiss{cursor:pointer;position:absolute;right:.75rem;top:.5rem;}.isHidden{display:none;}@media only screen and (max-width:37.5em){.isHiddenMobile{display:none;}}.petiteCaps{font-variant:petite-caps;}.flexCenter{display:flex;align-content:center;align-items:center;}.isNoWrap{white-space:nowrap;}.isFinger{cursor:pointer;}.neomorph{box-shadow:-8px -8px 16px rgba(251,238,208,.5),8px 8px 16px rgba(241,185,65,.5);}.neomorphSmall{box-shadow:-6px -6px 12px rgba(251,238,208,.5),6px 6px 12px rgba(241,185,65,.5);}.neomorphBottom{filter:drop-shadow(8px 8px 14px #f1b941);}.gradientBackground{background:linear-gradient(to right bottom,#f7d794,#f5cd79);}.borderR{border-radius:14px;}.borderRSmall{border-radius:7px;}.borderRBig{border-radius:28px;}.bg{background:#f6d287;}.sameMarginBottom{margin-bottom:1rem !important;}@font-face{font-family:'Ubuntu';src:url(/fonts/ubuntu-light-webfont.woff2) format("woff2");font-weight:300;font-style:normal;}@font-face{font-family:'Ubuntu-Mono';src:url(/fonts/ubuntumono-regular-webfont.woff2) format("woff2");font-style:normal;}html{font-family:Ubuntu,sans-serif;}.pure-menu-heading{text-transform:none;font-family:Ubuntu-Mono,'Noto Mono';}.menu-list li a{font-family:Ubuntu-Mono,'Noto Mono';}.menu-list a.active{background-color:#3273dc;color:#fff;}.main{display:flex;flex-wrap:nowrap;align-items:start;width:100%;height:100vh;padding:2.5%;}.mainNav{overflow-y:auto;padding:14px;width:17%;margin-right:40px;}.mainPage{overflow-y:auto;padding:28px;width:calc(83% - 40px);align-self:stretch;}.files{display:flex;flex-direction:column;align-items:stretch;}.filesWithEditor{display:flex;align-items:stretch;height:100%;}.files .buttons{justify-content:space-between;align-items:stretch;}.filesList{height:100%;overflow-y:auto;}
#blazor-error-ui{background:#ffffe0;bottom:0;box-shadow:0 -1px 2px rgba(0,0,0,.2);display:none;left:0;padding:.6rem 1.25rem .7rem 1.25rem;position:fixed;width:100%;z-index:1000;}#blazor-error-ui .dismiss{cursor:pointer;position:absolute;right:.75rem;top:.5rem;}.isHidden{display:none;}@media only screen and (max-width:37.5em){.isHiddenMobile{display:none;}}.petiteCaps{font-variant:petite-caps;}.flexCenter{display:flex;align-content:center;align-items:center;}.isNoWrap{white-space:nowrap;}.isFinger{cursor:pointer;}.neomorph{box-shadow:-8px -8px 16px rgba(251,238,208,.5),8px 8px 16px rgba(241,185,65,.5);}.neomorphSmall{box-shadow:-6px -6px 12px rgba(251,238,208,.5),6px 6px 12px rgba(241,185,65,.5);}.neomorphBottom{filter:drop-shadow(8px 8px 14px #f1b941);}.neomorphInset{box-shadow:inset 8px 8px 16px rgba(241,185,65,.5),inset -8px -8px 16px rgba(251,238,208,.5);}.neomorphInsetSmall{box-shadow:inset 6px 6px 12px rgba(241,185,65,.5),inset -6px -6px 12px rgba(251,238,208,.5);}.gradientBackground{background:linear-gradient(to right bottom,#f7d794,#f5cd79);}.borderR{border-radius:14px;}.borderRSmall{border-radius:7px;}.borderRBig{border-radius:28px;}.bg{background:#f6d287;}.sameMarginBottom{margin-bottom:1rem !important;}@font-face{font-family:'Ubuntu';src:url(/fonts/ubuntu-light-webfont.woff2) format("woff2");font-weight:300;font-style:normal;}@font-face{font-family:'Ubuntu-Mono';src:url(/fonts/ubuntumono-regular-webfont.woff2) format("woff2");font-style:normal;}html{font-family:Ubuntu,sans-serif;}.pure-menu-heading{text-transform:none;font-family:Ubuntu-Mono,'Noto Mono';}.menu-list li a{font-family:Ubuntu-Mono,'Noto Mono';}.menu-list a.active{background-color:#3273dc;color:#fff;}.main{display:flex;flex-wrap:nowrap;align-items:start;width:100%;height:100vh;padding:2.5%;}.mainNav{overflow-y:auto;padding:14px;width:17%;margin-right:40px;}.mainPage{overflow-y:auto;padding:28px;width:calc(83% - 40px);align-self:stretch;}.files{display:flex;flex-direction:column;align-items:stretch;}.filesWithEditor{display:flex;align-items:stretch;height:100%;}.files .buttons{justify-content:space-between;align-items:stretch;}.filesList{height:100%;overflow-y:auto;}

File diff suppressed because one or more lines are too long